<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单详情</title>

    <link rel="stylesheet" href="../css/OrderDetails.css">

</head>

  <body>

      <!--最上面的导航-->
      <div class="shortcut-2014">
          <div class="w">
              <ul class="fr">
                  <li class="fore1 fore1zidingyi" id="ttbar-login">
                      <a href="" class="link-login">你好，请登录</a>
                      &nbsp;&nbsp;
                      <a href="" class="link-regist style-red">免费注册</a>
                  </li>
                  <!--<li class="spacer"></li>-->
                  <li class="fore2">
                      <div class="dt">
                          <a href="" target="_blank">我的订单</a>
                      </div>
                  </li>
              </ul>
          </div>
      </div>

      <div id="o-header-2013">
          <div id="header-2013" style="display:none;"></div>
      </div>

      <!-- 下面的带 logo 的部分 -->
      <div id="nav">
          <div class="w">

              <!-- logo 部分 -->
              <div class="logo">
                  <a href="" class="fore11" target="_blank"></a>
                  <a href="" class="fore22" target="_blank">我的树懒</a>
                  <a href="" class="fore33" target="_blank">返回树懒首页</a>
              </div>

              <!-- 我的购物车部分样式 -->
              <div class="nav-r zidingyiright">
                  <div id="settleup-2014" class="dorpdown">
                      <div class="cw-icon" id="zidingyi">
                          <i class="ci-left"></i>
                          <i class="ci-right">></i>
                          <!--<i class="ci-count" id="shopping-amount">28</i>-->
                          <a href="" target="_blank">我的购物车</a>
                      </div>
                  </div>
              </div>

          </div>
      </div>

      <!--主体部分-->
      <div id="container">

          <!--提示信息-->
          <div class="emph-wrap">
              <div class="w">
                  <div class="emph-tips">
                      <b></b>
                      安全提醒：为了您的财产安全，
                      <strong>不要点击陌生链接、不要向陌生人转账</strong>
                      或透漏银行卡和验证码信息，
                      <strong>谨防诈骗</strong>
                      ！
                  </div>
              </div>
          </div>

          <!-- 订单信息大盒子 -->
          <div class="w">
              <div class="main">
                  <div class="breadcrumb">
                      <a href="">我的树懒</a>
                      <span>
                          &nbsp;>&nbsp;
                          <a href="">订单中心</a>
                          &nbsp;>&nbsp;
                          <strong>订单：</strong>
                          <span> <strong>213938053900</strong> </span>
                      </span>
                  </div>

                  <!-- 变量 -->
                  <span id="pay-button-order" style="display:none"></span>

                  <!-- 下面显示信息的盒子 -->
                  <div class="m order-state order-state01 order-state02">
                      <div class="mc state-cont">

                          <!-- 工具条 -->
                          <div class="state-lcol">
                              <div class="state-top">订单号：
                                  <span>213938053900</span>
                              </div>
                              <h3 class="state-txt ftx-02">完成</h3>
                              <br>
                              <span class="remain-time" style="display: none" time>
                                  <b></b>
                              </span>

                              <!-- 评价查看发票详情盒子 -->
                              <div class="state-btns">
                                  <a href="" id="pay-button-213938053900" class="btn-1 " style="display:none">付款</a>
                                  <!--<a href="" target="_blank" class="btn-9">查看发票详情</a>-->

                              </div>

                          </div>

                      </div>
                  </div>

                  <!-- 商品信息及其快递信息显示 -->
                  <div class="order-track order-track-02 m order-track-new">
                      <div class="mt">
                          <div class="track-tab">
                              <ul>
                                  <li class="tab-item curr" style="display:none;">订单跟踪</li>
                                  <li class="tab-item" style="display:none;">安装跟踪</li>
                              </ul>
                          </div>
                      </div>

                      <!-- 订单跟踪 -->
                      <div class="mc">
                          <div class="track-cont J-delivery-track">
                              <div class="track-lcol">
                                  <div class="p-item">
                                      <div class="p-img">
                                          <a href="">
                                              <img src="../images/sahngpinxaingqingdizhixinxi.jpg" alt>
                                          </a>
                                      </div>

                                      <div class="p-info">
                                          <ul>
                                              <li>送货方式：</li>
                                              <li class="p-info-left">京东快递</li>
                                              <li>承运人：</li>
                                              <li class="p-info-left">普通快递</li>
                                          </ul>
                                      </div>

                                  </div>

                                  <!-- 位置显示 -->
                                  <div class="ac" style="display:none">
                                      <a href="" class="btn-9 hide">查看地图</a>
                                  </div>

                              </div>

                              <div class="track-rcol">
                                  <div class="track-list track-list-date">
                                      <ul>
                                          <li class="afterdate  node-to-change track-node-0008  first">
                                              <i class="node-icon">
                                                  <i class="dot"></i>
                                                  <i class="state-icon"></i>
                                              </i>
                                              <span class="date">
                                                  2021-03-14
                                                  <span class="week">周日</span>
                                              </span>
                                              <span class="time">16:44:06</span>
                                              <span class="txt">
                                                  <div class="stress-txt">已签收</div>
                                                  您的订单已由本人签收。如有疑问您可以联系配送员【马哈哈，15138940237】确认。感谢您在树懒购物，欢迎再次光临。
                                              </span>
                                          </li>
                                          <li class=" node-to-change track-node-0006 ">
                                              <i class="node-icon">
                                                  <i class="dot"></i>
                                                  <i class="state-icon"></i>
                                              </i>
                                              <span class="time">14:39:11</span>
                                          </li>
                                      </ul>
                                  </div>
                              </div>

                          </div>
                      </div>

                  </div>


                  <!-- 收货地址信息显示 -->
                  <div class="m order-info-mod">
                      <div class="order-info order-info-new mc">
                          <div class="ui-switchable-body">
                              <div class="ui-switchable-panel-main">
                                  <div class="ui-switchable-panel">

                                      <!-- 收获人信息 -->
                                      <div class="dl">
                                          <div class="dt">
                                              <h4>收货人信息</h4>
                                          </div>
                                          <div class="dd">
                                              <div class="item">
                                                  <span class="label">收货人：</span>
                                                  <div class="info-rcol">哈哈哈</div>
                                              </div>
                                              <div class="item">
                                                  <span class="label">地址：</span>
                                                  <div class="info-rcol">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX平安街道平安小区XX</div>
                                              </div>
                                              <div class="item">
                                                  <span class="label">手机号码：</span>
                                                  <div class="info-rcol">***********</div>
                                              </div>
                                          </div>
                                      </div>

                                      <!-- 配送信息 -->
                                      <div class="dl">
                                          <div class="dt">
                                              <h4>配送信息</h4>
                                          </div>
                                          <div class="dd">
                                              <div class="item">
                                                  <span class="label">配送方式：</span>
                                                  <div class="info-rcol">
                                                      京东快递
                                                  </div>
                                              </div>
                                              <div class="item">
                                                  <span class="label">
                                                      期望送货日期：
                                                  </span>
                                                  <div class="info-rcol">
                                                      工作日、双休日与假日均可送货
                                                  </div>
                                              </div>
                                              <div class="item">
                                                  <span class="label"></span>
                                                  <div class="info-rcol"></div>
                                              </div>
                                          </div>
                                      </div>

                                      <!-- 付款信息 -->
                                      <div class="dl" id="pay-info-nozero">
                                          <div class="dt">
                                              <h4>付款信息</h4>
                                          </div>
                                          <div class="dd">
                                              <div class="item">
                                                  <span class="label">付款方式：</span>
                                                  <div class="info-rcol">在线支付</div>
                                              </div>
                                              <div class="item">
                                                  <div class="label">付款时间：</div>
                                                  <div class="info-rcol">
                                                      2021-03-12 10:01:06
                                                  </div>
                                              </div>
                                          </div>
                                      </div>

                                  </div>
                              </div>
                          </div>
                      </div>
                  </div>

                  <!-- 商品信息 -->
                  <div class="order-goods m">
                      <div class="mt goods-head">
                          <span class="shop-name">树懒</span>
                      </div>

                      <!-- 商品盒子 -->
                      <div class="mc">

                          <!-- 商品 -->
                          <div class="goods-list ">
                              <table class="tb-void tb-order">
                                  <colgroup>
                                      <col class="grap">
                                      <col class="col-goods">
                                      <col class="col-number">
                                      <col class="col-price">
                                      <col class="col-amount">
                                      <col class="col-bean">
                                      <col class="col-ops">
                                      <col class="grap">
                                  </colgroup>

                                  <!-- 商品的信息的提示 -->
                                  <thead>
                                    <tr>
                                        <th class="grap"></th>
                                        <th>商品</th>
                                        <th>商品编号</th>
                                        <th>树懒价</th>
                                        <th>商品数量</th>
                                        <th class="grap"></th>
                                    </tr>
                                  </thead>

                                  <!-- 商品的全部信息 -->
                                  <tbody>
                                    <tr class="first-tr product-100009279875">
                                        <td class="grap"></td>
                                        <td>
                                            <div class="p-item">
                                                <div class="p-img">
                                                    <a href="" target="_blank">
                                                        <img src="../images/dingdanxiangqingpicture01.jpg" data-lazy-img="done" width="60" height="60">
                                                    </a>
                                                </div>

                                                <!-- 商品信息盒子 -->
                                                <div class="p-info">
                                                    <div class="p-name">
                                                        <!--<em class="p-supermarket" title="树懒商城"></em>-->
                                                        <a class="a-link" href="" target="_blank" title="小米11 5G 骁龙888 2K AMOLED四曲面柔性屏 1亿像素 55W有线闪充 50W无线闪充 12GB+256GB 蓝色 游戏手机">小米11 5G 骁龙888 2K AMOLED四曲面柔性屏 1亿像素 55W有线闪充 50W无线闪充 12GB+256GB 蓝色 游戏手机</a>
                                                    </div>
                                                    <div class="clr"></div>
                                                    <div id="coupon_100009279875" class="fl"></div>
                                                    <div class="p-extra">
                                                        <span class="txt">蓝色</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- 七天无理由退货 -->
                                            <div class="p-tag mt10">
                                                <span>支持7天无理由退货</span>
                                            </div>
                                        </td>

                                        <!-- 商品编号 -->
                                        <td>
                                            <span class="productNumber">100017358352</span>
                                        </td>

                                        <!-- 商品价格 -->
                                        <td>
                                            <span class="f-price">￥</span>
                                            <span class="f-price">4699.00</span>
                                        </td>

                                        <!-- 商品数量 -->
                                        <td>
                                            <span class="productCount">1</span>
                                        </td>

                                        <!-- 右边边距 -->
                                        <td class="grap"></td>

                                    </tr>
                                  </tbody>

                              </table>
                          </div>

                          <!-- 商品价格信息 -->
                          <div class="goods-total">
                              <ul>

                                  <!-- 商品总额 -->
                                 <li>
                                     <span class="label">商品总额：</span>
                                     <span class="txt">￥</span>
                                     <span class="txt">4699.00</span>
                                 </li>

                                  <!-- 实际支付金额 -->
                                  <li class="ftx-01">
                                      <span class="label">实付款：</span>
                                      <span class="txt count">￥</span>
                                      <span class="txt count">4699.00</span>
                                  </li>

                              </ul>
                          </div>

                      </div>
                  </div>

              </div>
          </div>

          <!--下方提示信息-->
          <div id="cmsfooter">
              <div id="service-2017">

                  <!-- 多快好省 -->
                  <div class="w hhzidingyi">
                      <ol class="slogen">
                          <li class="item ">
                              <i>多</i>
                              品类齐全，轻松购物
                          </li>
                          <li class="item fore2">
                              <i>多</i>
                              多仓发货，极速配送
                          </li>
                          <li class="item fore3">
                              <i>好</i>
                              正品行货，精致服务
                          </li>
                          <li class="item fore4">
                              <i>省</i>
                              天天低价，畅选无忧
                          </li>
                      </ol>
                  </div>

                  <!--下面的信息-->
                  <div class="shulan-help">
                      <div class="w hhzidingyi">
                          <div class="tishixinxi">
                              <span class="zititishixinxi">欢迎使用树懒商城，为您提供高质量的服务，是我们商城最高的追求！</span>
                          </div>
                      </div>
                  </div>

              </div>
          </div>

  </div>

  </body>

</html>